<!--<template>-->
  <!--<ve-heatmap :data="chartData" :settings="chartSettings"></ve-heatmap>-->
<!--</template>-->


<template>
  <div>
    <el-row >
      <el-col :span="12">
        <ve-heatmap :data="chartData" :settings="chartSettings"></ve-heatmap>
    </el-col>
      <el-col :span="12">
        <ve-line :data="chartData1"></ve-line>
      </el-col>
    </el-row>
    <el-row :gutter="20">
      <el-col :span="12">
        <ve-line :data="chartData1"></ve-line>
      </el-col>
      <el-col :span="12">
        <el-amap vid="amap"></el-amap>
      </el-col>
    </el-row>
  </div>
</template>

<script>
  import VeLine from 'v-charts/lib/line.common'
  export default {
    components: { VeLine },
    data () {
      this.chartSettings = {
        //jFknwzsS2pUyWp03tYI8GHOIIwPwYUFn
        key: 'oBvDtR6nzWtVchkY4cLHtnah1VVZQKRK',
        bmap: {
          center: [120.14322240845, 30.236064370321],
          zoom: 14,
          roam: true
        },
        type: 'bmap'
      }
      return {
        chartData1: {
          columns: ['date', 'PV'],
          rows: [
            { 'date': '01-01', 'PV': 1231 },
            { 'date': '01-02', 'PV': 1223 },
            { 'date': '01-03', 'PV': 2123 },
            { 'date': '01-04', 'PV': 4123 },
            { 'date': '01-05', 'PV': 3123 },
            { 'date': '01-06', 'PV': 7123 }
          ]
        },
        chartData: {
          columns: ['lat', 'lng'],
          rows: [
            {'lat': 120.14322240845, 'lng': 30.236064370321},
            {'lat': 120.14301682797, 'lng': 30.236035316745},
            {'lat': 120.14138577045, 'lng': 30.236113748704},
            {'lat': 120.1400398833, 'lng': 30.235973050702},
            {'lat': 120.13893453465, 'lng': 30.23517220446},
            {'lat': 120.1382899739, 'lng': 30.234062922977},
            {'lat': 120.13265960629, 'lng': 30.231641351722},
            {'lat': 120.13170681763, 'lng': 30.229925745619},
            {'lat': 120.13119614803, 'lng': 30.228996846637},
            {'lat': 120.13023980134, 'lng': 30.228226570416}
          ]
        }
      }
    }
  }
</script>
